<template>
	<view>
		<!-- header -->
		<view style="height: 10px;"></view>
		<view class="header">
			<uni-search-bar :radius="100" @confirm="search" clearButton="auto" cancelButton="none"></uni-search-bar>
		</view>
		<view class="body">
			<!-- 功能区 -->
			<uni-card :is-shadow="false">
				<!-- 图表 -->
				<uni-row class="demo-uni-row" style="text-align: center;">
					<uni-col :span="6">
						<uni-icons type="medal-filled" size="45" color="#F3A73F"></uni-icons>
					</uni-col>
					<uni-col :span="6">
						<uni-icons type="mail-open-filled" size="45" color="#2979FF"></uni-icons>
					</uni-col>
					<uni-col :span="6">
						<uni-icons type="folder-add-filled" size="45" color="#E43D33"></uni-icons>
					</uni-col>
					<uni-col :span="6">
						<uni-icons type="auth-filled" size="45" color="#18BC37"></uni-icons>
					</uni-col>
				</uni-row>
				<!-- 文字 -->
				<uni-row class="demo-uni-row" style="text-align: center;">
					<uni-col :span="6">
						<text>考研考公</text>
					</uni-col>
					<uni-col :span="6">
						<text>工作实习</text>
					</uni-col>
					<uni-col :span="6">
						<text>发帖管理</text>
					</uni-col>
					<uni-col :span="6">
						<text>我的消息</text>
					</uni-col>
				</uni-row>
			</uni-card>
			<!-- 话题模块 -->
			<uni-card :is-shadow="false">
				<template>
					<view>
						<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem"
							styleType="text" activeColor="#2979FF"></uni-segmented-control>
						<view class="content">
							<view v-show="current === 0">
								<!-- <uni-card :is-full="true" :is-shadow="false"> -->
									<uni-list>
										<uni-list-item @click="topostReply()" title="关于考研的一些看法" note="阅读量:231" link>
											<template slot="header">
												<image style="width: 80px; height: 80px;" class="slot-image"
													src="/static/logo.png" mode="widthFix"></image>
											</template>
										</uni-list-item>
										<uni-list-item title="热门帖子" note="阅读量:231" link>
											<template slot="header">
												<image style="width: 80px; height: 80px;" class="slot-image"
													src="/static/logo.png" mode="widthFix"></image>
											</template>
										</uni-list-item>
										<uni-list-item title="热门帖子" note="阅读量:231" link>
											<template slot="header">
												<image style="width: 80px; height: 80px;" class="slot-image"
													src="/static/logo.png" mode="widthFix"></image>
											</template>
										</uni-list-item>
									</uni-list>
								<!-- </uni-card> -->
							</view>
							<view v-show="current === 1">
								选项卡2的内容
							</view>
							<view v-show="current === 2">
								选项卡3的内容
							</view>
						</view>
					</view>
				</template>
			</uni-card>
		</view>
		<!-- footer -->
		<view style="height: 10px;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				items: ['热门帖子', '最新帖子', '全部帖子'],
				current: 0,
				postName: "关于考研的一些看法"
			};
		},

		methods: {
			onClickItem(e) {
				if (this.current != e.currentIndex) {
					this.current = e.currentIndex;
				}
			},
			topostReply() {
				uni.navigateTo({
					url: "./postReply?postName=" + this.postName,
					fail: (res) => {
						console.log("error" + res);
					}
				})
			}
		}
	};
</script>

<style>

</style>
